#{extends 'clubuser.html' /}
#{set selected:'members' /}

#{form @Club.listClubMembers(name), method:'GET'}
    <p>
        <label for="name">Name: </label>
        <input type="text" class="text" name="name" id="name" value="${params.name}" />
        <input type="submit" class="button" value="Find" />
    </p>
#{/form}

<table>
    <thead>
        <tr>
        	<th>Name</th>
        	<th>Email</th>
        	<th>Hometown</th>
        	<th>Active</th>
        	<th>Activation ends</th>
        	<th>Club</th>
        </tr>
    </thead>
    <tbody>
    #{list items:members, as:'member'}
        <tr>
        	<td><a href="@{Club.editMember(member.id)}">${member.name}</a></td>
        	<td>${member.email}</td>
        	<td>${member.hometown}</td>
        	<td>${member.active}</td>
        	<td>
        	#{if member.activationEnds}
        	   ${member.activationEnds.format('dd MMM, yyyy')}
        	#{/if}
        	#{else}
        	   Never
        	#{/else}
        	</td>
        	<td>${member.club.userName}</td>
        </tr>
    #{/list}
    
    <table class="functions">
            <tr>
                <td>
                    <a href="@{Club.newMember}"><img src="@{'/public/images/club/add.png'}" /></a>
                    <a href="@{Club.newMember}"
                       style="font-style: oblique; text-decoration: none;">Add a new member</a>
                </td>
                <td>
                </td>
            </tr>
            </table>
    </tbody>
</table>